<!DOCTYPE html>
<html lang="zh_CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>返校通行证(2分钟内有效)</title>
    <style>
        body {
            background-color: #ececec;
        }
        .close {
            display: inline-block;
            width: 14px;
            height: 14px;
            margin: 43px 60px 15px 10px;
        }
        
        .text1 {
            color: black;
            font:normal 700 16px '思源黑体CN';
            display: inline-block;
            
        }
        .more {
            display: inline-block;
            width: 18px;
            height: 14px;
            margin: 43px 17px 15px 45px;
        }
        .background {
            height: 212px;
            background-color: blanchedalmond;
            
        }
        
        .pic {
            width: 328px;
            height: 210px;
            top: 25px;
            left:8px;
            position:relative;
            margin-bottom: 40px;
        }
        .white {
            height: 812px;
            background-color: white;
        }
        .text2 {
            color:#848683;
            font:normal 500 14px '微软雅黑';
            display: inline-block;
            margin: 16px 17px 0px;
        }
        .text3 {
            color:black;
            font:normal 500 18px '微软雅黑';
            
            
        }
        .line1 {
            height: 1px;
            background-color: #ececec;
        }
        .line2 {
            height: 1px;
            
            background-color: #ececec;
            margin-left: 15px;
        }
        .xuehao {
            height: 57px;
        }
        .pic2 {
            width: 14px;
            height: 15px;
            margin: 21px 20px;
            display: inline-block;
        }
        .number {
            font: normal 500 17px 'DIN';
            color: black;
            
        }
        .number2 {
            font: normal 400 74px 'DIN';
            color: black;
            padding: 20px 20px;
        }
        .text4 {
            color:#AEAEAE;
            font:normal 500 14px '微软雅黑';
            display: inline-block;
            margin: 52px 0px 50px 110px;
        }
        .text5 {
            color:#AEAEAE;
            font:normal 500 14px '微软雅黑';
            display: inline-block;
           
        }
        .shangbiao {
            width: 11px;
            height: 14px;
            display: inline-block;
            margin: 52px 0px;
        }
        .fangkuai{
        position: absolute;	
        width:45px;
	height:45px;
    }
    #sp1{
	left:45px;
	top:125px;
    }
    #sp2{
	left:90px;
	top:125px;
    }
    #sp3{
	left:135px;
	top:125px;
    }
    #sp4{
	left:180px;
	top:125px;
    }
    #sp5{
	left:225px;
	top:125px;
    }
    #sp6{
	left:270px;
	top:125px;
    }
    #sp7{
	left:315px;
	top:125px;
    }
    #sp8{
	left:45px;
	top:170px;
    }
    #sp9{
	left:90px;
	top:170px;
    }
    #sp10{
	left:135px;
	top:170px;
    }
    #sp11{
	left:180px;
	top:170px;
    }
    #sp12{
	left:225px;
	top:170px;
    }
    #sp13{
	left:270px;
	top:170px;
    }
    #sp14{
	left:315px;
	top:170px;
    }
    #sp15{
	left:45px;
	top:215px;
    }
    #sp16{
	left:90px;
	top:215px;
    }
    #sp17{
	left:135px;
	top:215px;
    }
    #sp18{
	left:180px;
	top:215px;
    }
    #sp19{
	left:225px;
	top:215px;
    }
    #sp20{
	left:270px;
	top:215px;
    }
    #sp21{
	left:315px;
	top:215px;
    }
    </style>
    
</head>

<body>
   
        <div id="bgc"style="height: 380px;
        background-color: blanchedalmond;">
            <img  class="pic" src="图像 1.png"/>
            <span id="time" class="number2"></span>
        </div>
        <div class="white">
            <div style=" height: 39px;">
                <span class="text2">学生返校通行证</span>
            </div>
            <div class="line1"> </div>
            <div class="xuehao">
                <div class="pic2">
                    <img src="用户.png" style="width: 14px;height: 15px ;"/>
                </div>
                
                <span class="text3">学号：</span>
                <span class="number">4032051269</span>
            </div>
            <div class="line2"> </div>

            <div class="xuehao">
                <div class="pic2">
                    <img src="用户.png" style="width: 14px;height: 15px ;"/>
                </div>
             
                <span class="text3">姓名：</span>
                <span class="text3">包天南</span>
            </div>
            <div class="line2"> </div>


            <div class="xuehao">
                <div class="pic2">
                    <img src="用户.png" style="width: 14px;height: 15px ;"/>
                </div>
                
                <span class="text3">学院：</span>
                <span class="text3">法学院</span>
            </div>
            <div class="line2"> </div>

            <div class="xuehao">
                <div class="pic2">
                    <img src="进度时间.png" style="width: 15px;height: 15px;"/>
                </div>
                
                <span class="text3">时间：</span>
                <span id='Date' class="number"></span>
                
            </div>
            <div class="line1"> </div>
            <div class="banquan">
                <span class="text4">版权所有</span>
                <div class="shangbiao">
                    <a href="javascript:divShow();" id="btnhref" class="btn-slide"> <img src="c.png"/></a>
                </div>
                <span class="text5">辽宁大学</span>
            </div>
            <div id="btnshow" style="display: none; float: left;">
                <p><span id="sp1" class= "fangkuai" style="background-color: #00FE06" onClick="bg(this)"></span>
                  
                  <span id="sp2" class= "fangkuai" style="background-color:#037F05" onClick="bg(this)"></span>
                  
                  <span id="sp3" class= "fangkuai" style="background-color:#007F82" onClick="bg(this)"></span>
                  
                  <span id="sp4" class= "fangkuai" style="background-color:#00FEFE" onClick="bg(this)"></span>
                  
                  <span id="sp5" class= "fangkuai" style="background-color:#FF00FA" onClick="bg(this)"></span>
                  
                  <span id="sp6" class= "fangkuai" style="background-color:#FF017E" onClick="bg(this)"></span>
                  
                  <span id="sp7" class= "fangkuai" style="background-color:#FFBFCD" onClick="bg(this)"></span>
                  
                  <span id="sp8" class= "fangkuai" style="background-color:#FD0100" onClick="bg(this)"></span>
                  
                  <span id="sp9" class= "fangkuai" style="background-color:#800000" onClick="bg(this)"></span>
                  
                  <span id="sp10" class= "fangkuai" style="background-color:#FFFF01" onClick="bg(this)"></span>
                  
                  <span id="sp11" class= "fangkuai" style="background-color:#82007E" onClick="bg(this)"></span>
                  
                  <span id="sp12" class= "fangkuai" style="background-color:#669900" onClick="bg(this)"></span>
                  
                  <span id="sp13" class= "fangkuai" style="background-color:#CCFF66" onClick="bg(this)"></span>
                  
                  <span id="sp14" class= "fangkuai" style="background-color:#FF5050" onClick="bg(this)"></span>
                  
                  <span id="sp15" class= "fangkuai" style="background-color:#6666FF" onClick="bg(this)"></span>

                  <span id="sp16" class= "fangkuai" style="background-color:#990099" onClick="bg(this)"></span>

                  <span id="sp17" class= "fangkuai" style="background-color:#996600" onClick="bg(this)"></span>

                  <span id="sp18" class= "fangkuai" style="background-color:#FF6600" onClick="bg(this)"></span>

                  <span id="sp19" class= "fangkuai" style="background-color:#9999FF" onClick="bg(this)"></span>

                  <span id="sp20" class= "fangkuai" style="background-color:#0033CC" onClick="bg(this)"></span>

                  <span id="sp21" class= "fangkuai" style="background-color:#C0C0C0" onClick="bg(this)"></span>
                  
            
            </div>
                
            
        </div>


        
    </div>
    <script>
        function divShow() {
            document.getElementById("btnshow").style.display = "block";
             
            document.getElementById("btnhref").href = "javascript:divhidden()";
        }
        function divhidden() {
            document.getElementById("btnshow").style.display = "none";
            
            document.getElementById("btnhref").href = "javascript:divShow()";
        }
    function bg(x){
    	var Color=document.all.item(x.id).style.backgroundColor;
    	document.getElementById("bgc").style.backgroundColor=Color;
    }
    
    function run() {
    var date=new Date();
        var year=date.getFullYear(); //获取当前年份
        var mon=date.getMonth()+1;  //获取当前月份
        var da=date.getDate();    //获取当前日
        var h=date.getHours();  //获取小时
       
        h=h>9?h:'0'+h;
        var m=date.getMinutes();  //获取分钟
        m = m > 9 ? m : '0' + m;
        var s=date.getSeconds();    //获取秒
        s = s> 9 ? s : '0' + s; 
        console.log(s);
        var d=document.getElementById('Date'); 
        var t=document.getElementById('time'); 
        t.innerHTML=h+':'+m+':'+s;
        d.innerHTML=year+'/'+mon+'/'+da;
        setTimeout("run()",1000);
    }
    run();

      </script>
</body>
</html>